<!DOCTYPE html>
<html>

<head>
	<meta charset="UTF-8">
	<title>我的订单</title>
	<meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0" name="viewport" />
	<meta content="yes" name="apple-mobile-web-app-capable" />
	<meta content="black" name="apple-mobile-web-app-status-bar-style" />
	<meta content="telephone=no" name="format-detection" />
	<!-- 引入核心样式 -->
	<link href="http://appimg.yinsoso.com/css/weui.min.css" rel="stylesheet">
	<link href="http://appimg.yinsoso.com/css/jquery-weui.css" rel="stylesheet">
	<link href="http://appimg.yinsoso.com/css/style-min.css" rel="stylesheet">
	<link href="http://appimg.yinsoso.com/css/public.css" rel="stylesheet">
	<!--当前页面的css-->
	<link href="css/orderReceiving.css" rel="stylesheet">
	<!-- 引入核心JS -->
	<script src="http://appimg.yinsoso.com/js/vue.min.js"></script>
	<script src="http://appimg.yinsoso.com/js/3.2.0-jquery.min.js"></script>
	<script src="http://appimg.yinsoso.com/js/jquery-weui.min.js"></script>
	<script src="http://appimg.yinsoso.com/js/index.min.js"></script>
	<script src="http://appimg.yinsoso.com/js/fastclick.min.js"></script>
	<script src="http://appimg.yinsoso.com/js/common.js" type="text/javascript" ></script>
</head>

<body>
	<div id="app">
		<div class="countDown" v-if="orderDetail.state == 0">
			<span>支付剩余时间：
				<span class="countTimes">{{coutdownTimeStr}}</span>
			</span>
		</div>
		<div class="countDown" v-if="orderDetail.state == 1">
			<span v-if="orderDetail.state == 1">买家已付款，请耐心等待发货！</span>
		</div>
		<div class="reveived-addr">
			<div class="addr-img">
				<img src="../images/me/icon12.png" />
			</div>
			<div class="addr-info">
				{{orderDetail.receive_name}} &nbsp;&nbsp;{{orderDetail.receive_mobile}}
				<div>
					<span>{{orderDetail.province}}{{orderDetail.city}}{{orderDetail.district}}{{orderDetail.address}}</span>
					<!-- <img src="../images/recruit2.png" /> -->
				</div>
			</div>
		</div>
		<div class="reveived-info">
			<!-- <img src="../images/buyImg.png" /> -->
			<img :src="orderDetail.head_img" />
			<div class="info-right">
				<div class="info-title">{{orderDetail.goods_name}}</div>
				<div class="info-color">{{orderDetail.spec}}</div>
				<div class="info-price">
					<span class="price">¥{{orderDetail.single_price}}</span>
					<span class="amount">
						x{{orderDetail.purchase_num}}
					</span>
				</div>
			</div>
		</div>
		<div class="reveived-pay">
			<ul>
				<li>
					<span class="pay-name">商品总价</span>
					<span class="pay-price">¥{{orderDetail.total_money}}</span>
				</li>
				<li>
					<span class="pay-name">运费</span>
					<span class="pay-price">¥{{orderDetail.express_money}}</span>
				</li>
				<li>
					<span class="pay-name">订单总价</span>
					<span class="pay-price">¥{{orderDetail.total_money}}</span>
				</li>

				<li>
					<span class="pay-names">需支付</span>
					<span class="pay-prices">¥{{orderDetail.pay_money}}</span>
				</li>
			</ul>
		</div>
		<template v-if="orderDetail.state == 2">
			<div style="height: 0.27rem;width: 100%;background:#F8F8F8"></div>
			<div class="order-info">
				<div>
					<span>订单编号：{{orderDetail.order_code}}</span>
				</div>
				<p>支付交易号：{{orderDetail.transaction_code}}</p>
				<p>创建时间：{{orderDetail.create_time}}</p>
				<p>付款时间：{{orderDetail.pay_time}}</p>
				<p>发货时间：{{orderDetail.delivery_time}}</p>
			</div>
			<div class="reveived-service">
				<a href="#" class="serviceBtn">联系客服</a>
			</div>
			<div class="reveived-operate">
				<a href="javascript:;" class="operateBtn" @click="receiveOK(orderDetail)">确认收货</a>
			</div>
		</template>
		<div class="reveived-operate" v-if="orderDetail.state == 0">
			<span class="totalPrice">实付总计：
				<span class="sum">¥{{orderDetail.pay_money}}</span>
			</span>
			<!--订单编号、支付交易号、实际总付-->
			<a href="javascript:;" @click="cancelPay(orderDetail)" class="cancelBtn">取消订单</a>
			<a href="javascript:;" @click="appPay(orderDetail)" class="payBtn">立即支付</a>
		</div>

	</div>

	<script type="text/javascript" src="js/orderPays.js"></script>
</body>

</html>
